<template>
  <el-table :data="contentArr">
    <el-table-column type="index" label="编号"></el-table-column>
    <el-table-column prop="title" label="标题" width="150px"></el-table-column>
    <el-table-column label="封面" width="80px">
      <template #default="scope">
        <img :src="BASE_URL+scope.row.imgUrl" style="width: 100%">
      </template>
    </el-table-column>
    <el-table-column prop="brief" label="摘要" width="300px"></el-table-column>
    <el-table-column prop="categoryName" label="分类" width="80px"></el-table-column>
    <el-table-column prop="viewCount" label="浏览量" width="80px"></el-table-column>
    <el-table-column prop="commentCount" label="评论量" width="80px"></el-table-column>
    <el-table-column prop="createTime" label="创建时间" width="180px"></el-table-column>
    <el-table-column label="操作" width="180px">
      <template #default="scope">
        <el-button type="success" @click="editContent(scope.row)">编辑</el-button>
        <el-button type="danger"
                   @click="deleteContent(scope.$index,scope.row)">删除
        </el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script setup>
import {onMounted, ref} from "vue";
import axios from "axios";
import router from "@/router";
import {ElMessage} from "element-plus";


const editContent = (c) => {
  router.push('/personal/post?id=' + c.id);
  localStorage.editFrom = 'admin';//设置修改来源页面
}
const deleteContent = (i, c) => {
  if (confirm("您确认删除此内容吗?")) {
    axios.post(BASE_URL + '/v1/contents/' + c.id + '/delete').then((response) => {
      if (response.data.code == 1) {
        ElMessage.success("删除成功!");
        contentArr.value.splice(i, 1);
      }
    })
  }
}
const contentArr = ref([]);
onMounted(() => {
  axios.get(BASE_URL + "/v1/contents/list/admin").then((response) => {
    if (response.data.code == 1) {
      contentArr.value = response.data.data;
    }
  })
})
</script>

<style scoped>

</style>